<template>
  <div class="xiangqing1">
    <head_><h1>订单详情</h1></head_>
    <p class="dingdanhao">
      <span>订单号：{{childlist.id}}</span><span>下单日期：{{this.childlist.start_time}}</span>
    </p>
    <xinxi_></xinxi_>
    <p class="xiangqing_day">租车时长：<span v-text="dates"></span> 天</p>
    <xiangqing1_total v-if="childlist.state===this.$store.state.orderState[0].state" :data="childlist"></xiangqing1_total>
    <xiangqing2_total v-if="childlist.state===this.$store.state.orderState[1].state" :data="childlist"></xiangqing2_total>
    <xiangqing3_total v-if="childlist.state===this.$store.state.orderState[2].state" :data="childlist"></xiangqing3_total>
  </div>
</template>
<script>
import head_ from "../header";
import xinxi_ from "./cheliangxinxi";
import xiangqing1_total from "./xiangqing1_total";
import xiangqing2_total from "./xiangqing2_total";
import xiangqing3_total from "./xiangqing3_total";
export default {
  props: {},
  data() {
    return {
      childlist: null,
      dates: null,
    };
  },
  methods: {},
  components: { head_, xinxi_, xiangqing1_total, xiangqing2_total, xiangqing3_total },
  beforeMount(){
    this.childlist = JSON.parse(this.$route.params.childlist)
    this.$store.state.carinfo.carname=this.childlist.carName
    //alert(JSON.stringify(this.$store.state.carinfo))
    this.$store.state.carinfo.coverImg=sessionStorage.getItem("coverImg")
    let start = new Date(this.childlist.startTime);
    let end = new Date(this.childlist.endTime);
    this.dates = Math.ceil((end-start)/1000/60/60/24);//租车时长

    let date = `${start.getFullYear()}-${start.getMonth()+1}-${start.getDate()}`;
    this.childlist.start_time = date;//下单日期
    this.$store.state.pingjiaCarId = this.childlist.carId
  }
  
};
</script>

<style scoped lang="less">
.xinxi {
  margin-top: 0;
  div {
    div:nth-child(2) {
      p {
        position: relative !important;
      }
      p:nth-child(1) {
        top: 0.4rem !important;
      }
      p:nth-child(2) {
        top: -0.3rem !important;
      }
    }
  }
}
.xiangqing1 {
  width: 100%;
  font-size: 0.12rem;
  .dingdanhao {
    font-size: 0.23rem;
    color: #666666;
    display: flex;
    justify-content: space-between;
    padding: 0 0.29rem 0 0.38rem;
    height: 0.94rem;
    line-height: 0.94rem;
  }
}
.xiangqing_day {
  width: 100%;
  height: 0.8rem;
  border-top: 0.01rem solid #e0e0e0;
  border-bottom: 0.01rem solid #e0e0e0;
  font-size: 0.23rem;
  color: #666666;
  padding-left: 0.38rem;
  line-height: 0.8rem;
  span {
    font-size: 0.27rem;
    color: #333333;
    font-weight: 600;
  }
}
</style>
